<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>跟随鼠标移动练习</title>
		<style type="text/css">
			*{margin: 0px; padding: 0px;}
			#div1{
				width: 208px; height: 208px;
				color: red;
				background: url(img/girl.gif) no-repeat;
				position: absolute;
			}
			body{
				background-color: black;
			}
		</style>
		<script type="text/javascript">
		
			window.onload = function(){
				//第一步：通过getElementById获取div标签
				//第二步：给页面添加鼠标移动事件
							把鼠标获取的的XY坐标赋值给div标签的属性left和top。
				
				var Odiv = document.getElementById("div1");
				document.onmousemove = function(ev){
					var e = ev || window.event;
					Odiv.style.left = e.clientX - 70 + "px";
					Odiv.style.top = e.clientY -70 + "px"
				}
			}
		</script>
	</head>
	<body>
		<div id="div1">div文本</div>
	</body>
</html>
